<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width" />
    <meta name="author" content="Megumin" />
    <meta name="robots" content="all" />
    <title>文章</title>
{%block link%} {%endblock%}
    <link rel="stylesheet" href="../../public/style/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../../public/layui/css/layui.css" />
    <link rel="stylesheet" href="../../public/style/css/master.css" />
    <link rel="stylesheet" href="../../public/style/css/gloable.css" />
    <link rel="stylesheet" href="../../public/style/css/nprogress.css" />
    <link rel="stylesheet" href="../../public/style/css/blog.css" />
    <link rel="stylesheet" href="../../public/layui/css/layui.css"  media="all">
</head>
<body>
<div class="header">
</div>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>导航带徽章和图片</legend>
</fieldset>

<div style="margin-top: 15px;">
    <header class="gird-header">
        <div class="header-fixed">
            <div class="header-inner">
                <a href="javascript:void(0)" class="header-logo" id="logo">Megumin</a>
                <nav class="nav" id="nav">
                    <ul class="layui-nav">
                        <li><a  href="/">首页</a></li>
                        <li><a href="/blog">博客</a></li>
                        <li><a href="/">留言</a></li>
                        <li><a href="/link">友链</a></li>
                        <li ></li>
                    </ul>
                </nav>

                <div id="myCanvas"></div>

                {%if user._id.toString()%}
                <div class="layui-nav">
                    <li class="layui-nav-item" style=float:right>
                        <a href="/" style="color: black"><img src="../../public/style/image/megumin.jpg" class="layui-nav-img"  >用户</a>
                        <dl class="layui-nav-child">
                            <dd><a href="/">用户信息</a></dd>
                            {%if user.isAdmin==true%}
                            <dd><a href="/admin">后台管理</a></dd>
                            {%endif%}
                            <dd><a href="/api/account/logout">退出登录</a></dd>
                        </dl>
                    </li>
                </div>
                {%else%}
                <ul class="blog-user">
                    <a href="/api/login" style="color: black">登入</a>
                </ul>
                {%endif%}
                <a class="phone-menu">
                    <i></i>
                    <i></i>
                    <i></i>
                </a>
            </div>
        </div>
    </header>


    {% block body%}
    {% endblock%}
    <footer class="grid-footer">
        <div class="footer-fixed">
            <div class="copyright">
                <div class="info">
                    <div class="contact">
                        <a href="javascript:void(0)" class="github" target="_blank"><i class="fa fa-github"></i></a>
                        <a href="https://wpa.qq.com/msgrd?v=3&uin=1245808560&site=qq&menu=yes" class="qq" target="_blank" title="1245808560"><i class="fa fa-qq"></i></a>
                        <a href="" class="email" target="_blank" title="1245808560@qq.com"><i class="fa fa-envelope"></i></a>
                        <a href="javascript:void(0)" class="weixin"><i class="fa fa-weixin"></i></a>
                    </div>
                    <p class="mt05">
                        Copyright &copy; 2020-2021 Megumin All Rights Reserved V.6.6.6 蜀ICP备10000000号
                    </p>
                </div>
            </div>
        </div>
    </footer>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="../../public/layui/layui.js"></script>
    <script src="../../public/js/Meg/gloable.js"></script>
    <script src="../../public/js/plugins/nprogress.js"></script>
    <script>NProgress.start();</script>
    <script src="../../public/js/pagecomment.js"></script>
    <script src="../../public/js/Meg/article.js"></script>
    <script src="https://blog-static.cnblogs.com/files/e-cat/cursor-effects.js"></script>
    <script>
        window.onload = function () {
            NProgress.done();
        };
    </script>
    <script> var x=1 </script>
    <script>
        layui.use('element', function(){
            var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
            //监听导航点击
            element.on('nav(demo)', function(elem){
                //console.log(elem)
                layer.msg(elem.text());
            });
        });
    </script>
</div>
<script>
    //用来给分类导航添加data-index
    $(document).ready($(function (){
        let $li = $(".article-category>li")
        $li.each(function (index){
            $(this).attr("data-index",index+1)
            //$(this).data('index',(index+1))
            //alert($(this).data('2'))
        })
        let $li_20 =$(".mt20 >li")
        $li_20.each(function (index){
            $(this).attr("data-index",index)
            //$(this).data('index',index)
            //alert($(this).data())
            //alert($(this).data("index"))
        })
    }))
</script>
<script src="../../public/lib/L2Dwidget.min.js"></script>
<script>
    L2Dwidget.init({
        "model": { "jsonPath":"../../public/model/live2d-widget-model-z16/assets/z16.model.json", "scale":1, "hHeadPos":0.5, "vHeadPos":0.618 },
        "display": { "position": "right", "width": 250, "height": 600, "hOffset": 80, "vOffset": -90 },
        "mobile": { "show": true, "scale": 0.3 },
        "react": { "opacity": 0.7},
        "dialog": {"enable": true, script: {
                'every idle 15s': '$hitokoto$',
                //触摸到class='star'对象
                'hover .star': '一定要不留遗憾的度过每天哦！ (*/ω＼*)',
                //触摸到身体
                'tap body': '害羞⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄',
                //触摸到头部
                'tap face': '嘻嘻（。＾▽＾）'
            }},
    });
</script>
{%block script%}{%endblock%}
</body>
</html>
